import React from "react";
import {Card, Col, Row} from "antd";
import BaseComponent from "../../../../redare/components/BaseComponent";
import RoleManage from "../role/RoleManage";
import RoleMenuGrid from "./RoleMenuGrid";
import RoleFunGrid from "./RoleFunGrid";

export default class RolePermissionManage extends BaseComponent {

    static defaultProps = {
        platform: undefined,
    };

    constructor(props) {
        super(props);
    }

    _onRoleSelected(role) {
        let roleId = null;
        if (role) {
            roleId = role.id;
        }
        if (this.roleMenuGrid) {
            this.roleMenuGrid.setRoleId(roleId);
        }
        if (this.roleFunGrid) {
            this.roleFunGrid.setRoleId(roleId);
        }
    }

    _onMenuSelected(menu) {
        let menuId = null;
        if (menu) {
            menuId = menu.menuId;
        }
        this.roleFunGrid.setMenuId(menuId);
    }


    render() {
        return (
            <Row gutter={[8, 8]}>
                <Col span={10}>
                    <Card title="角色管理" size="small" bordered={false}>
                        <RoleManage
                            platform={this.props.platform}
                            onRoleSelected={this._onRoleSelected.bind(this)}/>
                    </Card>

                </Col>
                <Col span={8}>
                    <Card title="菜单权限" size="small" bordered={false}>
                        <RoleMenuGrid ref={(o) => this.roleMenuGrid = o}
                                      platform={this.props.platform}
                                      onMenuSelected={this._onMenuSelected.bind(this)}/>
                    </Card>
                </Col>
                <Col span={6}>
                    <Card title="功能权限" size="small" bordered={false}>
                        <RoleFunGrid ref={(o) => this.roleFunGrid = o}
                                     platform={this.props.platform}/>
                    </Card>
                </Col>
            </Row>
        )
    }
}



